<!DOCTYPE html>
<html>
	<head>
		<title>五宝回收</title>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		<link rel="stylesheet" href="${s.base}/mobile/newcss/weui.min.css">
		<link rel="stylesheet" href="${s.base}/mobile/newcss/jquery-weui.css">
		<link rel="stylesheet" href="${s.base}/mobile/newcss/base.css?123456">
		<link rel="stylesheet" type="text/css" href="${s.base}/mobile/css/city.css"/>
	</head>

	<style type="text/css">
		html,body{background:#f5f5f5;}
		.xyg-comp-list-select{width:96%; margin: 0.2rem 2%; border-radius: 0.5rem; height:auto;}
		.xyg-comp-list-select-desc{width:100%;text-align:center;line-height:2.2rem; height:2.2rem;font-size: 0.8rem; color:#ffffff; letter-spacing: 0.01rem; border-radius: 0.2rem 0.2rem 0px 0px; background: #069AFE;border-right: 0.001rem solid #f5f5f5;border-left: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-item{width:90%; padding:0px 5%; line-height:2.2rem; height:2.2rem;font-size: 0.8rem; color:#333333; letter-spacing: 0.01rem; background: #FFF; border: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-item input::-webkit-input-placeholder {color: #999999;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-title{width:30%; color:#333333; height:2rem; text-align:left; float:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content{width:70%; height:2rem; text-align:left; float:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content input[type='text']{width:60%; height:2rem; line-height:2rem;background-color:transparent;border:0; text-align:left;}

		.xyg-comp-list-select-textarea{width:90%;  color:#333333;padding:0px 5%;height:13.2rem;font-size: 0.8rem;  letter-spacing: 0.01rem; background: #FFF; border: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-title{width:100%; line-height: 2rem; height:2rem; text-align:left;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-content{width:100%; height:4rem; text-align:left; float:left;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-content textarea{width:92%; padding: 0.2rem 4%; height:9.6rem; margin-bottom: 1rem; line-height:1rem;background-color:#E5E5E5;;border:0; text-align:left;}

		.xyg-comp-xy{height:2rem; line-height:2rem;width:93%; margin:0px 2% 0px 5%;}
		.xyg-bottom{width:90%; height:auto;  margin:1.5rem 5%;}
		.xyg-bottom  .xyg-btn{
			position: relative;
			background: #069AFE;
			display: block;
			margin-left: auto;
			margin-right: auto;
			padding-left: 14px;
			padding-right: 14px;
			box-sizing: border-box;
			font-size: 18px;
			text-align: center;
			text-decoration: none;
			color: #fff;
			line-height: 2.55555556;
			border-radius: 5px;
			-webkit-tap-highlight-color: rgba(0,0,0,0);
			overflow: hidden;
		}
	</style>
	<body>
	<div id="showContent">
		<div class="xyg-comp-list-select">
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					联系人
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="hidden" id="id" value="${shopAddress.id}" />
					<input type="text" id="linkName" value="${shopAddress.linkName}" placeholder="请输入联系人" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					手机号
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="text" id="phone" value="${shopAddress.phone}" placeholder="请输入手机号" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-title">
					小区名称
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="text" id="name" value="${shopAddress.name}" placeholder="请选择小区" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item" style="position: relative;">
				<div class="xyg-comp-list-select-item-title">
					<#if shopAddress?? && shopAddress.doorType == '2'>
					<div id="householdShow" data-values="2" style="width:4rem; height: 1.4rem;line-height: 1.4rem; border-radius: 0.7rem; text-align: center; position: absolute; left: 0.2rem; border:1px solid #000000; top:0.4rem; ">无户号</div>
					<#else>
					<div id="householdShow" data-values="1" style="width:4rem; height: 1.4rem;line-height: 1.4rem; border-radius: 0.7rem; text-align: center; position: absolute; left: 0.2rem; border:1px solid #000000; top:0.4rem; ">有户号</div>
					</#if>
				</div>

				<div class="xyg-comp-list-select-item-content">
					<div id="household" style="width: auto">
						<#if shopAddress?? && shopAddress.doorType == '1'>
						<input placeholder="幢" id="addressZ" type="text" value="${shopAddress.building}" style="width:2rem;display:inline;">幢		<input placeholder="单元" id="addressD" type="text"
																																							value="${shopAddress.unit}" style="width:2rem;display:inline;">单元		<input placeholder="室" value="${shopAddress.room}" id="addressS" type="text" style="width:2rem;display:inline;">室
						<#elseif shopAddress?? && shopAddress.doorType == '2'>
						<input placeholder="请输入户号" id="descripts" value="${shopAddress.descripts}" type="text">
						<#else>
						<input placeholder="幢" id="addressZ" type="text" style="width:2rem;display:inline;">幢		<input placeholder="单元" id="addressD" type="text" style="width:2rem;display:inline;">单元		<input placeholder="室" id="addressS" type="text" style="width:2rem;display:inline;">室
					</#if>
					</div>
				</div>
			</div>
		</div>
		<div class="xyg-bottom">
			<a href="javascript:;" class="xyg-btn" id="showTooltips" >提交</a>
		</div>
	</div>


	<!-- 城市选择 -->
	<div id="cityShow"  style="background: #fff;display: none;">
		<div id="showLetter" class="showLetter"><span>A</span></div>
		<div class="letter">
			<ul>
				<li><a href="javascript:;">热门</a></li>
				<li><a href="javascript:;">历史</a></li>
				<li><a href="javascript:;">A</a></li>
				<li><a href="javascript:;">B</a></li>
				<li><a href="javascript:;">C</a></li>
				<li><a href="javascript:;">D</a></li>
				<li><a href="javascript:;">E</a></li>
				<li><a href="javascript:;">F</a></li>
				<li><a href="javascript:;">G</a></li>
				<li><a href="javascript:;">H</a></li>
				<li><a href="javascript:;">J</a></li>
				<li><a href="javascript:;">K</a></li>
				<li><a href="javascript:;">L</a></li>
				<li><a href="javascript:;">M</a></li>
				<li><a href="javascript:;">N</a></li>
				<li><a href="javascript:;">P</a></li>
				<li><a href="javascript:;">Q</a></li>
				<li><a href="javascript:;">R</a></li>
				<li><a href="javascript:;">S</a></li>
				<li><a href="javascript:;">T</a></li>
				<li><a href="javascript:;">W</a></li>
				<li><a href="javascript:;">X</a></li>
				<li><a href="javascript:;">Y</a></li>
				<li><a href="javascript:;">Z</a></li>
			</ul>
		</div>
		<!--城市列表-->
		<div class="container-city">
			<div class="city">

			</div>
		</div>
	</div>
	</body>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
	<script src="${s.base}/mobile/newjs/jquery-2.1.4.js?12132"></script>
	<script src="${s.base}/mobile/newjs/jquery-weui.js?12132"></script>
	<script src="${s.base}/mobile/fonts/iconfont.js?12132"></script>
	<script src="${s.base}/mobile/js/zepto.js" ></script>
	<script src="${s.base}/mobile/js/city.js?1234545454"></script>
	<script src="${s.base}/mobile/js/base.js?12345454547777"></script>
	<!--js分享代码开始-->

	<input type="hidden" value="${jSTicketShareResponse.appid}" id="appid" />
	<input type="hidden" value="${jSTicketShareResponse.fxTitle}" id="fxTitle" />
	<input type="hidden" value="${jSTicketShareResponse.fxImgUrl}" id="fxImgUrl" />
	<input type="hidden" value="${jSTicketShareResponse.fxDesc}" id="fxDesc" />
	<input type="hidden" value="${jSTicketShareResponse.fxUrl}" id="fxUrl" />
	<input type="hidden" value="${jSTicketShareResponse.nonceStr}" id="nonceStr" />
	<input type="hidden" value="${jSTicketShareResponse.timestamp}" id="timestamp" />
	<input type="hidden" value="${jSTicketShareResponse.signature}" id="signature" />
	<script src="${s.base}/mobile/js/share.js"></script>

	<script type="text/javascript">
		var memberId = '${memberId}';
		var status = '${status}';
        $("#name").bind("click",function () {
            $("#cityShow").show();
            $("#showContent").hide();
        });
        function hideCity(data) {
            $("#cityShow").hide();
            $("#showContent").show();
            $("#name").val(data);
        }
		// 户号
		$("#householdShow").select({
			title: "户号选择",
			items: [{title:'有户号',value:'1'}, {title:'无户号',value:'2'}],
			onClose: function(d) {
				if (d.data.values == "1"){
					//$("#address").val("");
					var str = '<input placeholder="幢" id="addressZ" type="text" style="width:2rem;display:inline;">幢\
							<input placeholder="单元" id="addressD" type="text" style="width:2rem;display:inline;">单元\
							<input placeholder="室" id="addressS" type="text" style="width:2rem;display:inline;">室';
					$("#household").html(str);
				} else {
					var str='<input placeholder="请输入户号" id="descripts" type="text">';
					$("#household").html(str);
				}
				//$("#address").val(d.data.values);
				d.$input[0].innerText = d.data.titles
			},
			onOpen: function() {
				console.log("open");
			},
		});

        $("#showTooltips").on("click", function () {
            var linkName = $("#linkName").val();
            if (linkName == null || linkName == "") {
                $.toast("请输入联系人", "text");
                return false;
            }
            var phone = $("#phone").val();
            if (phone == null || phone == "") {
                $.toast("请输入手机号", "text");
                return false;
            }
            if (!(/^1(3|4|5|7|8)\d{9}$/.test(phone))) {
                $.toast("手机号码有误，请重填", "text");
                return false;
            }
            // 小区名称
            var name = $("#name").val();
            if (name == null || name == "") {
                $.toast("请选择小区", "text");
                return false;
            }
            // 类型
            var householdType = $("#householdShow").attr("data-values");
            var descripts = "";
            var building = "";
            var unit = "";
            var room = "";
            if (householdType == "2") {
                descripts = $("#descripts").val();
                if (descripts == null || descripts == "") {
                    $.toast("请输入无户号地址", "text");
                    return false;
                }
            } else {
                building = $("#addressZ").val();
                if (building == null || building == "") {
                    $.toast("请填写幢", "text");
                    return false;
                }
                unit = $("#addressD").val();
                if (unit == null || unit == "") {
                    $.toast("请填写单元", "text");
                    return false;
                }
                room = $("#addressS").val();
                if (room == null || room == "") {
                    $.toast("请填写室", "text");
                    return false;
                }
			}
            var id = $("#id").val();
            var param = {
                id: id,
                memberId: memberId,
                name: name,
                linkName: linkName,
                phone: phone,
                doorType:householdType,
                descripts: descripts,
                building: building,
                unit: unit,
                room: room
            };
            $.showLoading("正在提交中");
            $.post("/phone/updateOrAddAddress", param, function (result) {
                if (0 == result.code) {
                    // showLayerAlertNoRefre("操作成功！");
                    $.hideLoading();
                    $.alert("提交成功",function () {
                        goShopAddressListPageLase(memberId,status);
                    });

                } else {
                    $.hideLoading();
                    $.alert(result.msg);
                }
            }, "json");
        });
	</script>
</html>
